<%@page import="com.mto.module.karaoke.service.UserSongsLocalServiceUtil"%>
<%@page import="com.liferay.portal.service.UserLocalServiceUtil"%>
<%@page import="com.liferay.portal.model.User"%>
<%@ include file="/jsps/main.jsp"%>

<%
String orderByCol = ParamUtil.getString(request, "orderByCol", "createDate");
String orderByType = ParamUtil.getString(request, "orderByType", "asc").toLowerCase();

UserSongs searchUserSongs = new UserSongsImpl();

PortletURL nameSearchUrl = renderResponse.createRenderURL();
nameSearchUrl.setParameter("jspPage", "/jsps/san-khau/view.jsp");
nameSearchUrl.setParameter("tab", "san-khau");
nameSearchUrl.setPortletMode(PortletMode.VIEW);

PortletURL playUrl = renderResponse.createRenderURL();
playUrl.setParameter("jspPage", "/jsps/san-khau/play.jsp");
playUrl.setParameter("tab", "san-khau");
playUrl.setPortletMode(PortletMode.VIEW);

%>

<%
PortletURL renderUrl = renderResponse.createRenderURL();
renderUrl.setParameter("tab", "phong-thu");

PortletURL sortUrl = renderResponse.createRenderURL();
sortUrl.setParameter("tab", "phong-thu");
sortUrl.setParameter("jspPage", "/jsps/phong-thu/view.jsp");
sortUrl.setParameter("orderByType", "asc".equals(orderByType) ? "desc" : "asc");
%>

<div class="karaoke-sort">
	<%
	sortUrl.setParameter("orderByCol", "modifiedDate");
	boolean orderByModifiedDate = "modifiedDate".equals(orderByCol);
	boolean orderByRecordNumber = "recordNumber".equals(orderByCol);
	%>
	<a href="<%=sortUrl.toString()%>">
		<liferay-ui:message key="thoi-gian-cap-nhap" />
	</a>
	<c:if test="<%= orderByModifiedDate %>">
		&nbsp;&nbsp;<img src="<%= imgPath + orderByType + ".png"%>">
	</c:if>
	&nbsp;&nbsp;|&nbsp;&nbsp;
	<%
	sortUrl.setParameter("orderByCol", "recordNumber");
	%>
	<a href="<%=sortUrl.toString()%>">
		<liferay-ui:message key="luot-thu" />
	</a>
	<c:if test="<%= orderByRecordNumber %>">
		&nbsp;&nbsp;<img src="<%= imgPath + orderByType + ".png"%>">
	</c:if>
</div>

<div class="karaoke-paging">
	<%
	nameSearchUrl.setParameter("songName", "");
	%>
	<a href="<%=nameSearchUrl.toString()%>"><liferay-ui:message key="tat-ca" /></a>&nbsp;&nbsp;&nbsp;
<%
for(char x = 'A'; x <= 'Z'; x++) {
	nameSearchUrl.setParameter("songName", String.valueOf(x) +StringPool.PERCENT);
	%>
	<a href="<%= nameSearchUrl.toString()%>"><%= x %></a>
	<c:if test="<%= x != 'Z' %>">&nbsp;&nbsp;|&nbsp;&nbsp;</c:if>
	<%
}
%>
</div>

<ul id="karaoke-grid">
<liferay-ui:search-container emptyResultsMessage="no-song-found" delta="<%=10 %>" orderByCol="<%=orderByCol %>" orderByType="<%=orderByType %>" iteratorURL="<%=tab0Url%>">
	<liferay-ui:search-container-results>
		<%
		results = UserSongsServiceUtil.search(searchUserSongs, searchContainer.getStart(), searchContainer.getEnd(), orderByCol, orderByType);
		results = ListUtil.copy(results);
		total = UserSongsServiceUtil.searchCount(searchUserSongs);
		
		pageContext.setAttribute("results", results);
		pageContext.setAttribute("total", total);
		%>
	</liferay-ui:search-container-results>
	
	<liferay-ui:search-container-row className="com.mto.module.karaoke.model.UserSongs" modelVar="userSongs" keyProperty="userSongId">
		<%
		Song song = SongServiceUtil.getSong(userSongs.getSongId());
		User shower = UserLocalServiceUtil.getUser(userSongs.getUserId());
		String songId = String.valueOf(userSongs.getSongId());
		renderUrl.setParameter("songId", songId);
		playUrl.setParameter("userSongsId", String.valueOf(userSongs.getUserSongId()));
		%>
		<li>
			<div class="box">
			<div class="image-avatar">
			 <img alt="" src="<%=userSongs.getAvatar()%>" class="avatar">
			</div>
				
				<div class="box-info">
					<div  class="song-name">						
						<span class="label"><liferay-ui:message key="songName"/> </span>
						<span class="text">
							<a href="<%= playUrl.toString()%>"><%=song.getSongName() %></a>
						</span>
					</div>
					<div>
						<span class="label"><liferay-ui:message key="singer"/> </span>
						<span class="text"><%=shower.getScreenName() %></span>
					</div>
					<div>
						<span class="label"><liferay-ui:message key="listenNumber"/> </span>
						<span class="text"><%=userSongs.getListenNumber() %></span>
					</div>
					<div>
						<span class="label"><liferay-ui:message key="commentNumber"/> </span>
						<span class="text"><%=userSongs.getCommentNumber() %></span>
					</div>
				</div>
				<div style="clear: both;"></div>
			</div>
		</li>
	</liferay-ui:search-container-row>
	<liferay-ui:search-iterator />
</liferay-ui:search-container>
</ul>
<div style="clear: both;"></div>

<div class="karaoke-paging">
	<%
	nameSearchUrl.setParameter("songName", "");
	%>
	<a href="<%=nameSearchUrl.toString()%>"><liferay-ui:message key="tat-ca" /></a>&nbsp;&nbsp;&nbsp;
<%
for(char x = 'A'; x <= 'Z'; x++) {
	nameSearchUrl.setParameter("songName", String.valueOf(x) +StringPool.PERCENT);
	%>
	<a href="<%= nameSearchUrl.toString()%>"><%= x %></a>
	<c:if test="<%= x != 'Z' %>">&nbsp;&nbsp;|&nbsp;&nbsp;</c:if>
	<%
}
%>
</div>